<template>
    <IModal v-model="defaultValue" :width="960">
        <div class="import-box">
            <IContent v-model="componentProps">
                <ISearch v-model="search">
                    <FormItem :label-width="1">
                        <ButtonGroup>
                            <Button type="primary" icon="ios-search" size="small">搜索</Button>
                            <Button type="success" icon="ios-add" size="small" @click="openComponent(`ImportFrom`)">导入产品
                            </Button>
                        </ButtonGroup>
                    </FormItem>
                </ISearch>

                <ITable :current="page.current" :table="table" :total="page.total" @on-page-change="pageChange"
                        :loading="loading">
                    <template slot-scope="{ row, index }" slot="type">
                        <span v-if="row.type === 0">产品模板</span>
                        <span v-if="row.type === 1">申报要素</span>
                    </template>
                    <template slot-scope="{ row, index }" slot="user">
                        <span>{{row.user.name}}</span>
                    </template>
                </ITable>

                <component slot="component" v-if="componentProps.value" :is="componentProps.view"
                           v-model="componentProps.value"
                           :props="componentProps.props"
                           @input="getLists(page.current)"></component>
            </IContent>
        </div>
    </IModal>
</template>

<script>
    import IContent from "../../../../components/layout/IContent";
    import ISearch from "../../../../components/layout/ISearch";
    import ITable from "../../../../components/layout/ITable";
    import IContentMixins from "../../../../mixins/iContentMixins"
    import IModal from "../../../../components/layout/IModal";
    import IDrawerMixins from "../../../../mixins/iDrawerMixins";

    import ImportFrom from './import-from';

    export default {
        name: 'IImport',
        components: {
            IModal, ImportFrom,
            ITable, ISearch, IContent
        },
        mixins: [IContentMixins, IDrawerMixins],
        data() {
            return {
                search: {},
                table: {
                    columns: [{
                        title: '文件地址',
                        key: 'file',
                        width: 450
                    }, {
                        title: '类型',
                        slot: 'type',
                    }, {
                        title: '备注',
                        key: 'remark',
                    }, {
                        title: '操作人',
                        slot: 'user',
                    }, {
                        title: '时间',
                        key: 'created_at',
                    }]
                },
            }
        },
        methods: {
            getLists(page) {
                this._lists(`product/import`, page);
            }
        }
    }
</script>

<style scoped>
    .import-box {
        height: 500px;
    }
</style>
